<template>
  <Table :columns="columns" :data="data">
  </Table>
</template>

<script>
  import graphApi from '../../api/graph.api'
  import {formatDate} from '../../libs/util'

  export default {
    name: 'graphList',
    data() {
      let self = this
      return {
        columns: [
          {
              title: 'ID',
              key: 'id'
          },
          {
              title: '名称',
              key: 'name'
          },
          {
            title: '操作',
            slot: 'action',
            width: 200,
            render: (h, params) => {
                return h('div', [
                    h('Button', {
                        props: {
                            type: 'primary',
                            size: 'small'
                        },
                        style: {
                            marginRight: '5px'
                        },
                        on: {
                            click: () => {
                                this.onEdit(params.index)
                            }
                        }
                    }, '编辑'),
                    h('Button', {
                        props: {
                            type: 'error',
                            size: 'small'
                        },
                        on: {
                            click: () => {
                                this.onDelete(params.index)
                            }
                        }
                    }, '删除')
                ]);
            }
          }
        ],
        data: [],
      }
    },
    created() {
      graphApi.list().then(response => {debugger;
        this.data = response.data.data;
      })
    },
    computed: {},
    methods: {
      onCreate() {
        console.log('onCreate')
      },
      onEdit(id) {
        console.log(id)
        this.$router.push('/graphs/edit/' + id);
      },
      onDelete() {
        console.log('onDelete')
      }
    }
  }
</script>
